/*
 * To change this template, choose Tools | Templates
 * and open the template in the editor.
 */
package view;

import javafx.scene.CustomNode;
import javafx.scene.image.ImageView;
import javafx.scene.image.Image;
import javafx.scene.Group;
import javafx.scene.Node;
import javafx.scene.control.Button;
import vinciappli.Templates;
import javafx.scene.shape.Rectangle;
import javafx.scene.text.Font;
import javafx.scene.paint.Color;
import javafx.scene.paint.LinearGradient;
import javafx.scene.paint.Stop;
import javafx.scene.text.Text;
import javafx.scene.input.MouseEvent;
import javafx.animation.transition.TranslateTransition;
import javafx.scene.control.Label;
import javafx.scene.control.Slider;
import javafx.scene.layout.HBox;
import control.ControllerPrincipal;
import javafx.scene.layout.VBox;
import javafx.scene.shape.StrokeLineJoin;
import javafx.scene.Cursor;

/**
 * @author Sik
 */
public class MenuScreen extends CustomNode
{
    def bg =
        Image
        {
            url: "{{Templates.MENU_BG_PATH}}"
            backgroundLoading: true

        };

    def background : ImageView =
    ImageView
    {
        image : bg
        x: 0
        y: 0
        fitHeight: Templates.STAGE_HEIGHT
        fitWidth: Templates.STAGE_WIDTH
    };

    def dispFill = LinearGradient {
        endX: 0.0
        endY: 20.0
        proportional: false
        stops: [
            Stop {
                offset : 0
                color: Color.GRAY
            },
            Stop {
                offset: 0.2
                color: Color.WHITE
            }
        ]
    }

    function menuSelection(y : Integer) : Void
    {
        var yNode = rect.y;
        
        def transSelecttion =
        TranslateTransition
        {
                duration: 0.5s
                node: rect

                toY: y - yNode - (Templates.MENU_BUTTON_HEIGHT /1.4)
                repeatCount:1 autoReverse: false
        }
        transSelecttion.play();
    }

    def play:Group = Group
    {
        var y = 100
        content:
        [
            Text
            {
                translateX: 45
                translateY: y

                onMouseEntered:function (e:MouseEvent) : Void
                {
                    rect.visible = true;
                    menuSelection(y);
                }

                onMouseClicked:function (e:MouseEvent) : Void
                {
                    playMenu.visible= true;
                }

                content:"JOUER"
                fill: null
                stroke: Color.BLANCHEDALMOND
                strokeWidth: 2.0
                
                font:Font
                {
                    size: 60
                }
            }
        ]
        cursor: Cursor.HAND
    }

    def playMenu : Group =
    Group
    {
        translateX: 400
        translateY: 80
        visible: false

        var initialTroop =
        Slider
        {
            value: ControllerPrincipal.getINSTANCE().getControllerGameBoard().getGameBoard().getInitialPts()
            min: 5
            max: 30
            vertical: false
            showTickMarks: true
            showTickLabels: true
            labelFormatter: function(num) {"{%(,.0f num}"}
            snapToTicks:true
            blockIncrement:5
        }

        var maxPts =
        Slider
        {
            value: ControllerPrincipal.getINSTANCE().getControllerGameBoard().getGameBoard().getMaxPts()
            min: 80
            max: 200
            vertical: false
            showTickMarks: true
            showTickLabels: true
            labelFormatter: function(num) {"{%(,.0f num}"}
            snapToTicks:true
            blockIncrement:10
        }

        var configWindow =
        Rectangle
            {
                height: 500
                width: 500
                fill: Color.WHITESMOKE
                stroke: Color.WHITESMOKE
                arcHeight: 40
                arcWidth: 40
                opacity:0.7
            }

        content :
        [
            configWindow,
            VBox
            {
                translateY: 50
                spacing: 50
                content :
                [
                    Text
                    {
                        translateX: 10
                        content: "CONFIGURATION DE LA PARTIE"
                        fill: Color.BLACK
                        font:Font
                        {
                            size: 30
                        }
                    }

                    HBox
                    {
                        translateX: 20
                        //translateY: 120
                        spacing:10
                        content:
                        [
                            Label
                            {
                                text: "Nombre de troupes au début du jeu :"
                                textFill: Color.BLACK
                                font:Font
                                {
                                    size: 15
                                }
                            },

                            initialTroop,

                            Label
                            {
                                text: bind "{%(,.0f initialTroop.value}"
                                textFill: Color.BLUE
                                font:Font
                                {
                                    size: 15
                                }
                            }
                        ]
                    }

                    HBox
                    {
                        translateX: 20
                        //translateY: 160
                        spacing:10
                        content:
                        [
                            Label
                            {
                                text: "Nombre de points pour la victoire :"
                                textFill: Color.BLACK
                                font:Font
                                {
                                    size: 15
                                }
                            },

                            maxPts,

                            Label
                            {
                                text: bind "{%(,.0f maxPts.value}"
                                textFill: Color.BLUE
                                font:Font
                                {
                                    size: 15
                                }
                            }
                        ]
                    }

                    Button
                    {
                        text: "OK"
                        font:Font
                        {
                            size: 20
                        }
                        translateX: configWindow.width / 2
                        width:80
                        height:50
                        cursor: Cursor.HAND
                        action: function()
                        {
                            ControllerPrincipal.getINSTANCE().gameSetUp(Integer.valueOf(initialTroop.value), Integer.valueOf(maxPts.value));
                            close();
                        }
                    }
                ]
            }
        ]
    }

    
    def rect = Rectangle
    {
        x: 25
        y: 150
        height: Templates.MENU_BUTTON_HEIGHT
        width: Templates.MENU_BUTTON_WIDTH
        fill: null
        stroke: Color.RED
        strokeWidth: 6.0
        strokeLineJoin: StrokeLineJoin.ROUND
        visible: false
    }

    public override function create() : Node
    {
        ini();
        Group
        {
            content:
            [
                background,
                play, rect,
                playMenu
            ];
        }

    }

    public function ini() : Void
    {

    }

    public function close() : Void
    {
        ViewPrincipal.nextScreen(this);
    }
}
